<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script type="text/javascript">
	/*
	触发历史管理：1.页面跳转	2.hash值改变	3.pushState方法
	*/
/*
	//直接使用浏览器的history：需要具备三个条件或步骤：
	1.必须在服务器下运行（该html文件放在服务器上）
	2.pushState有三个参数：数据  标题(未能实现标题的改变)   地址(可选).	history.pushState()
	3.onpopstate事件：读取数据	window.onpopstate && event.state

	这种方法的特点是：
		1.进行历史管理时，网址不会改变。
		2.如果在pushState加入网址，应该给个虚假的网址，再在服务器端指定对应的页面，否则用户刷新时会找不到页面
*/
	window.onload = function (){
		var oBtn = document.getElementById('btn1');
		var oDiv = document.getElementById('div1');

		oBtn.onclick = function (){
			var arr = randomNum(35,7);

			history.pushState(arr, '');
			oDiv.innerHTML = arr;
		};

		window.onpopstate = function (ev){
			var ev = ev ||event;
			oDiv.innerHTML = ev.state;
		}
	}

	function randomNum(iAll, iNow){
			var arr = [];
			var newArr = [];

			for (var i = 1; i <= iAll; i++) {
				arr.push(i);
			};
			
			for (var i = 0; i < iNow; i++) {
				var del = Math.floor( Math.random()*arr.length );		//这样取得35的概率会不会很低
				newArr.push( arr.splice(del, 1) );						//将删除的值返回到newArr里
			};
			return newArr;
		}
	</script>
</head>
<body>
	<input type="button" value="随机选择" id="btn1" />
	<div id="div1"></div>
</body>
</html>